~(function($, fi) {
    var stepGraph = function(element, option) {
        var data = option.data;
        var jStepGraph = $(this);
        this.el = element;
        this.size = data.length;
        this.index = 0;
        this.el.addClass("step-graph");
        this.el.addClass("clearfix");
        for (var i = 0; i < data.length; i++) {
            var htmlString = '<div class="step"><span>' + data[i].content + '</span></div>';
            var jStep = $(htmlString);
            this.el.append(jStep);
        }
    };
    stepGraph.prototype.next = function() {
        if (this.index < this.size) {
            this.el.find(".step").eq(this.index).addClass("active");
            this.index++;
        }
    };
    stepGraph.prototype.pri = function() {
        if (this.index > 0) {
            this.index--;
            this.el.find(".step").eq(this.index).removeClass("active");
        }
    }
    var plugin = function(option) {
        return this.each(function() {
            var jThis = $(this);
            var data = jThis.data("step-graph");
            if (!data) {
                jThis.data("step-graph", new stepGraph(jThis, option));
            }
            if (typeof option == "string") {
                data[option].call(data);
            }
        })
    }
    $.fn.stepGraph = plugin;
})(window.$, window.fi)